<%@page import="org.apache.commons.lang3.StringUtils"%>
<%@page import="com.kerrykidz.sales.dao.model.PosOrderEntity"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<%@ taglib uri="token-tag" prefix="t"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<jsp:include page="/common/commonCss.jsp"></jsp:include>
<jsp:include page="/common/commonJs.jsp"></jsp:include>
<script type="text/javascript"
	src="${basePath }commonJs/jquery.imageScroller.js"></script>
<script type="text/javascript"
	src="${basePath }commonJs/quinn_commons.js"></script>


<script type="text/javascript"
	src="${basePath }resources/membership/finger.js"></script>

<script type="text/javascript">
	$(document).ready(function() {
		var errMsg = '${errMsg}';
		if (errMsg.length > 0) {
			alertInfo(errMsg);
		}

		$("#listBox").imageScroller({
			next : "btnNext",
			prev : "btnPrev",
			frame : "list",
			child : "li",
			auto : false
		});
	});

	var memId = null;

	var path = null;

	var money = null;

	function selectedme(o, id, name, p, m) {
		$(".checkedStyle").removeClass("checkedStyle");
		$(o).addClass("checkedStyle");
		alertInfo("已选择" + name + "为支付账户");
		memId = id;
		path = p;
		money = m;
	}

	function okpay() {
		if (path == null) {
			alertInfo("请选择一个小朋友");
			return;
		}
		$("#img_mem").attr("src", path);
		$('#e').window('close');
		$("#czxf").attr("checked", true);
		$("#blance").html(money);
		$("#czxf_ss").val(zyjfe);
		$("#payer").val(memId);
	}

	function openWindow() {
		var zw = collectFingerFeatrue();
		$
				.ajax({
					url : "${basePath}payment/findCusMemByFinger.shtml",
					type : "post",
					data : {
						finger : zw
					},
					dataType : "json",
					async : false,
					error : function(a, b, c) {
						alertError(b);
					},
					success : function(d) {
						$("#dl_1 dd").remove();
						if (d[0] == null || d[0].length == 0) {
							alertInfo("未找到合适的人员");
						} else {
							$("#czxf").attr("disable", "");
							var data = d[1];
							if (data.length == 1) {
								var o = data[0];
								var div = getLiHtml(o);
								$("#liA").html(div);
							} else if (data.length == 2) {
								var o = data[0];
								var o2 = data[1];
								var div1 = getLiHtml(o);
								var div2 = getLiHtml(o2);
								$("#liA").html(div1);
								$("#liB").html(div2);
							} else if (data.length > 2) {
								$("ul[id='list']").find("li").remove();
								$.each(data, function(ind, obj) {
									var div = getLiHtml(obj);
									var li = "<li>" + div + "</li>";
									$("ul[id='list']").append(li);
								});
							}
							$
									.each(
											data,
											function(ind, obj) {
												var yfje = $("#yfje").html();
												var dd = "<dd>";
												dd += "<ul class=\"ul_radio\">";
												dd += "<li>"
														+ formatName(obj.memName)
														+ "</li>";
												var b = (obj.balance == null ? 0
														: obj.balance);
												dd += "<li>余额：<span class=\"color_lv mlr5\">￥<span id=\"mem_b_"+obj.pkMemId+"\">"
														+ b
														+ "</span></span></li>";
												dd += "<li>实收：￥<input type=\"text\" value=\""+yfje+"\" class=\"w70 f14 iput_t\" name=\"hyss\" id=\""+obj.pkMemId+"_"+d[0]+"\"></li>";
												dd += "</ul> </dd>";
												$("#dl_1").append(dd);
											});

							$("#czxf").attr("checked", true);
						}
					}
				});
	}

	function formatName(memname) {
		if (memname.length > 3) {
			return memname = memname.substring(0, 3);
		}
		return memname;
	}

	function getLiHtml(o) {
		var div = "<div class=\"fl shouyin_hui m10\">";
		div += "<p>";
		div += "<img width=\"102\" height=\"136\" src=\"${basePath}common/showImage.shtml?imagePath="
				+ o.imagePath + "\">";
		div += "</p>";
		div += "<p>";
		div += formatName(o.memName) + "&nbsp;&nbsp;<span>" + o.age
				+ "岁</span>";
		div += "</p>";
		div += "<p class=\"f11\">";
		div += o.isVip == "1" ? "会员" : "非会员";
		div += "</p>";
		div += "<p>" + o.pkMemId + "</p>";
		div += " </div>";
		return div;
	}
</script>


<style>
#listBox {
	width: 160px;
	height: 230px !important;
}

#container {
	width: 800px;
	position: absolute;
}

.thistab_a input {
	background: #ccc !important;
	color: #333 !important;
}

.checkedStyle {
	border-color: blue;
}
</style>


</head>
<body class="bg">

	<div class="content m_auto">
		<div class="content_l mt10">
			<ul>
				<shiro:hasPermission name="payment/skmx.shtml">
					<li class="content_hover"><a
						href="${basePath }payment/skmx.shtml"><i class="nav_icon_k"></i><br>收款</a></li>
				</shiro:hasPermission>
				<shiro:hasPermission name="payment/symx.shtml">
					<li><a href="${basePath }payment/symx.shtml"><i
							class="nav_icon_l"></i><br>收银明细</a></li>
				</shiro:hasPermission>


			</ul>
		</div>
		<div class="content_r mt10">
			<div class="p20">
				<h1 class="f16">订单信息</h1>
				<div class="goods_order_top fixed mt10 f14">
					<ul class="ml10">
						<li><label>订单号：</label>${order.pkOrderId }</li>
						<li><label>当前操作人：</label>${loginUser.name }</li>
						<li>${loginUser.branName }</li>
					</ul>
				</div>
				<table class="table mt10">
					<tr>
						<th>序号</th>
						<th>商品编号</th>
						<th>商品名称</th>
						<th>数量</th>
						<th>单价</th>
						<th>小计</th>
						<th>折扣率</th>
						<th>备注</th>
						<th>折后金额</th>
					</tr>

					<c:forEach var="p" items="${products }" varStatus="vs">
						<tr>
							<td>${vs.index+1 }</td>
							<td>${p.fkPrdId }</td>
							<td><c:choose>
									<c:when test="${p.type eq '1' }">
									${p.productName }
								</c:when>
									<c:otherwise>
									充值
								</c:otherwise>
								</c:choose></td>
							<c:choose>
								<c:when test="${p.type eq '1' }">
									<td>${p.count }</td>
									<td>${p.price }</td>
									<td>${p.price*p.count }</td>
								</c:when>
								<c:otherwise>
									<td>-</td>
									<td>-</td>
									<td>${p.count }</td>
								</c:otherwise>
							</c:choose>
							<td>${empty p.disValue ? '无' :p.disValue  }</td>
							<td>${p.discComments }</td>
							<td>${p.disPrice }</td>
						</tr>
					</c:forEach>

					<tr>
						<td colspan="10">
							<ul class="goods_ul fr p10">
								<!-- 非预付 -->
								<c:if test="${!isPrepay }">
									<c:set value="${order.paidAmount==null?0:order.paidAmount  }"
										var="paidAmount"></c:set>
									<li>商品总价：<span class="color_lv mlr5 f18">￥${order.amount }</span></li>
									<c:if test="${paidAmount>0 }">
										<li>已付金额：<span class="color_lv mlr5 f18">￥${paidAmount }</span></li>
									</c:if>
									<c:if test="${wbqje!=null and wbqje>0 }">
										<li>玩伴券金额：<span class="color_lv mlr5 f18">￥${wbqje }</span></li>
									</c:if>
									<c:if test="${giftPrice!=null and giftPrice>0 }">
										<li>礼券金额：<span class="color_lv mlr5 f18">${giftPrice }</span></li>
									</c:if>
									<c:if test="${hyxfzk!=null and hyxfzk>0 }">
										<li>会员续费优惠金额：<span class="color_lv mlr5 f18">${hyxfzk }</span></li>
									</c:if>
									<c:if test="${zkje!=null and zkje>0 }">
										<li>折扣金额<span class="color_lv mlr5 f18">￥<fmt:formatNumber
													value="${zkje}" pattern="0.#"></fmt:formatNumber></span></li>
									</c:if>
									<li>应付金额<span class="fb mlr5 color_org f18">￥<span
											id="yfje"><fmt:formatNumber
													value="${order.amount-paidAmount-giftPrice-wbqje-hyxfzk-zkje }"
													pattern="0.#"></fmt:formatNumber></span></span></li>
								</c:if>
								<c:if test="${isPrepay }">
									<li>应付金额<span class="fb mlr5 color_org f18">￥<span
											id="yfje"><fmt:formatNumber
													value="${order.paidAmount ==null ? 0 : order.paidAmount }"
													pattern="0.#"></fmt:formatNumber></span></span></li>
								</c:if>
							</ul>
						</td>
					</tr>
				</table>


				<c:if test="${order.feteFlag eq '1' || order.giftNo !=null }">
					<div class="mt10">
						<table class="table">
							<tr>
								<th>宴请单</th>
								<th>礼券</th>
							</tr>
							<tr>
								<td><input type="button" value="查看附件" class="btn_l"
									onclick="window.location.href='${basePath}common/showImage.shtml?imagePath=${order.fkFeteFile }'"></td>
								<td><input type="button" value="查看" class="btn_l"
									onclick="$('#exx').window('open')"></td>
							</tr>
						</table>
					</div>
				</c:if>
				<textarea style="width: 1116px; margin-top: 10px;" class="textare"
					disabled placeholder="客户要求"></textarea>
				<div class="chuzhi mt10 p10">
					<c:if test="${hasVirtual }">
						<a href="#" onclick="javascript:alertInfo('不可使用');"> <img
							src="${basePath}commonCss/images/zhiwen_w.png" class="fl p10"></a>
					</c:if>
					<c:if test="${!hasVirtual }">
						<a href="#" onclick="openWindow();"> <img
							src="${basePath}commonCss/images/zhiwen_c.png" class="fl p10"></a>
					</c:if>



					<div id="btnNext">
						<a href="javascript:void(0);"
							class="collection_t_l collection_t_lx"></a>
					</div>
					<div id="listBox">
						<ul id="list">
							<li id="liA">
								<!----扫描前---->
								<div class="fl shouyin_hui m10">
									<img src="${basePath}commonCss/images/index_02.png" width="111"
										height="186">
								</div> <!----扫描前---->
							</li>
							<li id="liB">
								<!----扫描前---->
								<div class="fl shouyin_hui m10">
									<img src="${basePath}commonCss/images/index_02.png" width="111"
										height="186">
								</div> <!----扫描前---->
							</li>

						</ul>
					</div>
					<div id="btnPrev">
						<a href="javascript:void(0);"
							class="collection_t_r collection_t_rx"></a>
					</div>



					<c:if test="${hasVirtual }">
						<!----------不可使用余额---->
						<dl class="shouyin_shou border_r">
							<h2 class="f16" style="color: #ccc;">
								<input type="checkbox" class="mr5" disabled="disabled">储值消费
							</h2>
							<span class="shouyin_no">当前不可使用余额</span>
						</dl>
						<!----------不可使用余额---->
					</c:if>

					<c:if test="${!hasVirtual }">
						<dl class="shouyin_shou border_r" id="dl_1">
							<h2 class="f16">
								<input type="checkbox" class="mr5" id="czxf" disabled="disabled">储值消费
							</h2>
						</dl>
					</c:if>
					<dl class="shouyin_shou pl50">
						<h2 class="f16">
							<input type="checkbox" class="mr5" id="fczxf">非储值消费
						</h2>
						<dd>
							<input type="radio" class="mr5" name="fczxf_p" value="fczxf_xj">现金
						</dd>
						<dd class="ml20">
							实收：￥<input type="text" class=" w70 f14 iput_t" id="fczxf_xj">
						</dd>
						<dd>
							<input type="radio" class="mr5" name="fczxf_p" value="fczxf_yhk">银行卡
						</dd>
						<dd class="ml20">
							实收：￥<input type="text" class="w70 f14 iput_t" id="fczxf_yhk">
						</dd>
					</dl>
				</div>




				<div class="btm_btn mt10">
					<dl>
						<dd>
							<input type="button" class="btn" value="结算完成" onclick="dopay();">
						</dd>
						<dd>
							<input type="button" class="btn" value="取消"
								onclick="cancelOrder();">
						</dd>
						<dd>
							<input type="button" class="btn" value="返回"
								onclick="history.go(-1)">
						</dd>
					</dl>
				</div>
			</div>
		</div>


		<div style="display: none;">
			<object classid="clsid:82C2415C-1EC7-41ED-A6F0-2BCA3B4216E2"
				id="finger" codebase="${basePath }plugin/Ferly727.ocx">
				<param name="_ExtentX" value="635">
				<param name="_ExtentY" value="582">
				<param name="_StockProps" value="64">
				<param name="Enabled" value="1">
			</object>
		</div>

		<!---弹出层--->
		<div id="exx" class="easyui-window" title="查看礼券"
			data-options="modal:true,closed:true,iconCls:'icon-save'"
			style="width: 500px; height: 350px; position: relative;">
			<div class="m10">
				<table class="table">
					<tr>
						<th>礼券号</th>
					</tr>
					<%
						PosOrderEntity order =  (PosOrderEntity)request.getAttribute("order");
																																				if(StringUtils.isNotBlank(order.getGiftNo())){
																																					String giftno[] = order.getGiftNo().split(",");
																																					for(String gn : giftno){
					%>
					<tr>
						<td><%=gn%></td>
					</tr>
					<%
						}
																																				}
					%>
				</table>
			</div>
			<div class="btm_btn btm_bg">
				<dl>
					<dd>
						<input type="button" class="btn"
							onClick="$('#exx').window('close')" value="关闭">
					</dd>
				</dl>
			</div>
		</div>
		<!---弹出层--->

		<form action="${basePath }payment/addPayment.shtml" method="post"
			id="payform">
			<t:token />
			<input type="hidden" name="orderId" value="${order.pkOrderId }">
			<input type="hidden" name="memPays" id="memPays"> <input
				type="hidden" name="xj" id="xj"> <input type="hidden"
				name="yhk" id="yhk"> <input type="hidden" name="isPrepay"
				value="${isPrepay }">
		</form>
</body>
</html>


<script type="text/javascript">
	$(document).ready(function() {
		$("input:radio[name='fczxf_p']").change(function() {
			$("#fczxf").attr("checked", true);
			var txt = $(this).val();
			var yfje = $("#yfje").html();
			$("input:radio[name='fczxf_p']").each(function() {
				$("#" + $(this).val()).val(null);
			});
			$("#" + txt).val(yfje);
		});
	});

	function dopay() {

		var value = [];

		var ye_amount = 0;
		var xj_amount = 0;
		var yhk_amount = 0;
		var czxf = $("#czxf").attr("checked") == "checked";
		var fczxf = $("#fczxf").attr("checked") == "checked";

		var memPays = "";
		if (czxf) {
			$("input:text[name='hyss']").each(function() {
				var v = $(this).val();
				if (isNaN(v)) {
					alertInfo("输入金额只能为数字");
					return;
				} else {
					ye_amount += parseFloat(v);
				}
				memPays += $(this).attr("id") + "_" + v + ",";
			});
		}

		if (fczxf) {
			var k = $("input:radio[name='fczxf_p']:checked").val();
			var v = $("#" + k).val();
			if (isNaN(v)) {
				alertInfo("输入金额只能为数字");
				return;
			}
			if (k == "fczxf_yhk") {
				yhk_amount = parseFloat(v);
			} else {
				xj_amount = parseFloat(v);
			}
		}

		//应付金额
		var yfje = $("#yfje").html();

		var amount = yhk_amount + xj_amount + ye_amount;
		if (amount < parseFloat(yfje)) {
			alertInfo("你所支付的金额不足以支付应付金额");
			return;
		} else if (amount > parseFloat(yfje)) {
			alertInfo("你所支付的金额大于应付金额");
			return;
		}

		var msg = "您将使用";
		if (ye_amount > 0) {
			msg += "余额支付[￥" + ye_amount + "]<br>";
		}
		if (xj_amount > 0) {
			msg += "现金支付[￥" + xj_amount + "]<br>";
		}
		if (yhk_amount > 0) {
			msg += "银行卡支付[￥" + yhk_amount + "]<br>";
		}
		msg += "应付金额为:￥" + yfje + "<br>";
		msg += "确认要继续吗?";

		$.messager.confirm('info', msg, function(b) {
			if (b) {
				$("#memPays").val(memPays);
				if (xj_amount > 0)
					$("#xj").val(xj_amount);
				if (yhk_amount > 0)
					$("#yhk").val(yhk_amount);
				$("#payform")[0].submit();
			}
		});
	}

	function cancelOrder() {
		$.messager
				.confirm(
						"提示",
						"确认取消该订单吗",
						function(d) {
							if (d) {
								window.location.href = "${basePath}order/cancelOrder.shtml?id=${order.pkOrderId}"
							}
						});
	}
</script>